$(function() {
	$("#jqGrid")
			.jqGrid(
					{
						url : '../sys/user/list',
						datatype : "json",
						colModel : [
								{
									label : '用户ID',
									name : 'userId',
									width : 45,
									key : true
								},
								{
									label : '用户名',
									name : 'username',
									width : 75
								},
								{
									label : '邮箱',
									name : 'email',
									width : 90
								},
								{
									label : '手机号',
									name : 'mobile',
									width : 100
								},
								{
									label : '状态',
									name : 'status',
									width : 80,
									formatter : function(value, options, row) {
										return value === 0 ? '<span class="label label-danger">禁用</span>'
												: '<span class="label label-success">正常</span>';
									}
								}, {
									label : '创建时间',
									name : 'createTime',
									width : 80
								} ],
						viewrecords : true,
						height : 385,
						rowNum : 10,
						rowList : [ 10, 30, 50 ],
						rownumbers : true,
						rownumWidth : 25,
						autowidth : true,
						multiselect : true,
						pager : "#jqGridPager",
						jsonReader : {
							root : "page.list",
							page : "page.currPage",
							total : "page.totalPage",
							records : "page.totalCount"
						},
						prmNames : {
							page : "page",
							rows : "limit",
							order : "order"
						},
						gridComplete : function() {
							// 隐藏grid底部滚动条
							$("#jqGrid").closest(".ui-jqgrid-bdiv").css({
								"overflow-x" : "hidden"
							});
						}
					});
});

var vm = new Vue({
	el : '#rrapp',
	data : {
		q : {
			username : null
		},
		showList : true,
		title : null,
		roleList : {},
		user : {
			status : 1,
			roleIdList : []
		}
	},
	methods : {
		query : function() {
			vm.reload();
		},
		add : function() {
			vm.showList = false;
			vm.title = "新增";
			vm.roleList = {};
			vm.user = {
				status : 1,
				roleIdList : []
			};

			// 获取角色信息
			this.getRoleList();
		},
		update : function() {
			var userId = getSelectedRow();
			if (userId == null) {
				return;
			}

			vm.showList = false;
			vm.title = "修改";

			vm.getUser(userId);
			// 获取角色信息
			this.getRoleList();
		},
		del : function() {
			var userIds = getSelectedRows();
			if (userIds == null) {
				return;
			}

			confirm('确定要删除选中的记录？', function() {
				$.ajax({
					type : "POST",
					url : "../sys/user/delete",
					data : JSON.stringify(userIds),
					success : function(r) {
						if (r.code == 0) {
							alert('操作成功', function(index) {
								$("#jqGrid").trigger("reloadGrid");
							});
						} else {
							alert(r.msg);
						}
					}
				});
			});
		},
		saveOrUpdate : function(event) {
			var url = vm.user.userId == null ? "../sys/user/save"
					: "../sys/user/update";
			$.ajax({
				type : "POST",
				url : url,
				data : JSON.stringify(vm.user),
				success : function(r) {
					if (r.code === 0) {
						alert('操作成功', function(index) {
							vm.reload();
						});
					} else {
						alert(r.msg);
					}
				}
			});
		},
		getUser : function(userId) {
			$.get("../sys/user/info/" + userId, function(r) {
				vm.user = r.user;
			});
		},
		getRoleList : function() {
			$.get("../sys/role/select", function(r) {
				vm.roleList = r.list;
			});
		},
		reload : function(event) {
			vm.showList = true;
			var page = $("#jqGrid").jqGrid('getGridParam', 'page');
			$("#jqGrid").jqGrid('setGridParam', {
				postData : {
					'username' : vm.q.username
				},
				page : page
			}).trigger("reloadGrid");
		}
	}
});